<template>
  <z-container>
    <z-aside>
      <classify-aside :options="group" v-model="checked"></classify-aside>
    </z-aside>
    <z-main>
      <z-container>
        <z-main>
          <lazy-component class="zui-p-10px">
            <z-image v-for="(item, index) in 5" :key="'1' + index" :src="$utils.randomEnum($store.state.image)" width="100%" height="200px"></z-image>
          </lazy-component>
          <classify-nav :title="checked.name"></classify-nav>
          <lazy-component class="zui-p-10px">
            <z-image v-for="(item, index) in 5" :key="'2' + index" :src="$utils.randomEnum($store.state.image)" width="100%" height="200px"></z-image>
          </lazy-component>
        </z-main>
      </z-container>
    </z-main>
  </z-container>
</template>

<script>
import ClassifyAside from './classify-aside'
import ClassifyNav from './classify-nav'
export default {
  components: {
    ClassifyAside,
    ClassifyNav
  },
  data () {
    return {
      group: [],
      goods: [],
      checked: {}
    }
  },
  methods: {
    getGroup (sortId) {
      console.log(sortId)
      let i = 20
      let tmp = []
      while (i > 0) {
        tmp.push({
          id: i,
          name: '二级分类' + i
        })
        i--
      }
      this.group = tmp
      this.checked = tmp[0]
    }
  },
  computed: {
    _sortId () {
      const val = this.$route.query
      return val
    }
  },
  created () {
    this.getGroup(this._sortId)
  }
}
</script>

<style lang="less">
</style>
